<template>
    <div style="background-color:#fff">
        <div v-if="hasSelectPath">
            <input type="text" placeholder="请输入手机号" v-model="phones">
            <el-button @click="query">查询</el-button>
            <el-button @click="add">新增</el-button>
            <el-button @click="delet">根据id删除</el-button>
            <el-button @click="put">根据id修改</el-button>
        </div>
        <div v-else>请点击上方“展示更多操作”按钮</div>
    </div>
</template>
<script>
import {
    queryList,
    addList,
    deletList,
    putData
} from '@/api/request'
export default {
    name: 'select-1',
    data() {
        return {
            phones: ''
        }
    },
    computed:{
        hasSelectPath(){
            return this.$route.path.indexOf('Select') != -1
        }
    },
    methods: {
        async query() {
            let params = {
                phones: this.phones
            }
            const res = await queryList('/tables/list', params)
            console.log('res==>', res);
        },
        async add() {
            let data = {
                name: '刘能',
                sex: '1', // 0 男 ； 1 女
                phone: '15148756259',
                email: '1985568547@qq.com',
                account: 'liuSir',  // 英文名字
                status: 'true',
                role: '主任',
                id: '6555'
            }
            const res = await addList('/tables/add', data)
            console.log('新增', res);
        },
        async delet() {
            let data = {
                id: 1
            }
            const res = await deletList('/tables/delet', data)
            console.log('删除', res);
        },
        async put() {
            let data = {
                id: 3,
                name: '赵四',
                role: '经理'
            }
            const res = await putData('/tables/put', data)
            console.log('修改', res);
        }

    },
}
</script>
<style scoped></style>